<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			ul li {
				width: 50px;
				height: 50px;
				background-color: blue;
				color: white;
				display: inline-block;
				line-height: 50px;
				text-align: center;
				/*定位*/
				border-radius: 25px;
				margin: 5px;
			}
			
			ul {
				position: absolute;
				left: 200px;
				top: 380px;
			}
			
			.current {
				background-color: red;
			}
		</style>
	</head>

	<body>
		<a href="http://www.jd.com" id="al">京东</a>
		<button onclick="changeLocation()">修改京东为百度</button>

		<img src="../img/1.jpg" id="img" />
		<button onclick="changesrc()">按钮</button>
		<ul>
			<li>1</li>
			<li>2</li>
			<li>3</li>
			<li>4</li>
		</ul>
		<form action="02动态样式表.html" id="myform">
			<input type="submit" />
		</form>
		<button onclick="changeAction()">修改表单的action</button>
	</body>

	<script>
		function changeLocation() {
			var al = document.getElementById("al");
			al.setAttribute("href", "http://www.baidu.com");
			al.innerHTML = "百度";
		}

		function changeAction() {
			var f = document.getElementById("myform");
			//修改表单的action属性
			f.setAttribute("action", "01location对象.html");
			//提交表单
			f.submit();
		}
		//定义图片的位置
		var index = 1;
		//设置定时器
		var timer = setInterval("changesrc()",3000);
		//获取所有li对象
		var lis = document.getElementsByTagName("li");
		//修改对象的属性
		function changesrc() {
			//获取对象
			var img = document.getElementById("img");
			/*console.log(img);
			//获取图片对象的src属性
			var imgsrc = img.src;
			console.log(imgsrc);*/
			//设置src属性
			if(index > 4) {
				index = 1;
			}
			for(var i = 0; i < lis.length; i++) {
				lis[i].className = "";
			}
			img.src = "../img/" + index + ".jpg";
			lis[index-1].className = "current";
			index++;
			//使用方法
			//img.setAttribute("src","../img/3.jpg");
		}
	</script>

</html>